/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See full license in root of repo. */

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

p {
    padding: 5px 0;
}

    p.monthly {
        position: relative;
        top: -8px;
    }

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    width: 100%;
}

.column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    width: 100%;
    height: 100%;
    padding: 7.5px;
}

    .column.alpha {
        padding-left: 0;
    }

    .column.omega {
        padding-right: 0;
    }

.margin15 {
    margin-right: 15px;
}

@media screen and (min-width: 0px) and (max-width: 800px) {
    .row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .alpha,
    .omega {
        padding: 0px !important;
    }
}

/* Custom styles for the add-in */
.custom-header {
    margin-bottom: 5px;
}

.header--spacer {
    margin-bottom: 15px;
}

.header--text {
    margin-top: 10px;
}

.object {
    width: 100%;
    max-width: 250px;
}

/* Custom dropdown styling to ensure arrows are visible */
.ms-Dropdown-select {
    width: 100%;
    padding: 8px 30px 8px 12px;
    border: 1px solid #ccc;
    background: white;
}

